import { Dialog,Button } from "@nutui/nutui-react-taro";
import { useState } from "react";
import './index.scss'
import { View } from "@tarojs/components";
import '@nutui/nutui-react-taro/dist/style.css'
import React from "react";
 function dialog(props) {
    if (!props.visible) return null;
    const confirm = (val) => {
        props.onConfirm(val);
    };

    const [visible,setVisible] = useState(true)
    // debugger
const cancel = () => {
    props.onCancel();
}

    return (
            <Dialog
                title={props.title}
                visible={visible}
                onConfirm={() => {
                    props.onCancel();
                    setVisible(false)
                }}
                onCancel={cancel}
                footer={
                    <View className="dialog-footer">
                        <Button className="cancel" onClick={() => {
                                props.onCancel();
                            setVisible(false)
                        }}>取消</Button>
                        <Button className="global_button confirm" onClick={() => {
                                props.onCancel();
                            setVisible(false)
                        }}>确认</Button>
                    </View>
                }
                style={{
                // @ts-ignore
                    "--nutui-dialog-header-font-size":'16px',
                    "--nutui-dialog-header-font-weight":'400',
                    "--nutui-dialog-width":'280px',
                    // "--nutui-dialog-min-height": '160px',
                    // "--nutui-dialog-close-color": '#F7F8F9',
                    // "--nutui-dialog-close-width": '114px',
                    // "--nutui-dialog-close-height": '38px',
                    // "--nutui-dialog-footer-ok-max-width": '140px',
                    "--nutui-dialog-footer-button-min-width": '114px',
                    "-nutui-dialog-content-line-height": '40px',
              
                }}
            >
                {props.children}
            </Dialog>
    )
}

export default React.memo(dialog)